"use client";
import { deleteUser } from "@/src/actions/users";
import { DropdownMenuItem } from "@/src/components/ui/dropdown-menu";
import { useRouter } from "next/navigation";
import { useCallback, useTransition } from "react";

export const DeleteDropdownItem = ({ id }) => {
  const [isPending, startTransition] = useTransition();
  const router = useRouter();
  const onClick = useCallback(() => {
    startTransition(async () => {
      await deleteUser(id);
      router.refresh();
    });
  }, [id, router]);
  return (
    <DropdownMenuItem
      className=" hover:bg-red-500 focus:bg-red-500 cursor-pointer hover:text-white focus:text-white"
      onClick={onClick}
      disabled={isPending}
    >
      Delete
    </DropdownMenuItem>
  );
};
